import { Image, Linking, StyleSheet, Text, View } from 'react-native'
import React, { useEffect, useState } from 'react'
import AsyncStorage from '@react-native-async-storage/async-storage'
import axios from 'axios';
import { Button } from '@ant-design/react-native';
import { router } from 'expo-router';

export default function buyPage() {
    const [num,setNum]=useState(1)
    const [data, setData] = useState<any>({
        name: '',
        price: 0,
        img: [],
        desc: '',
        _id: ''
      });
    // const [url, setUrl] = useState('');
    const buyItem=()=>{
      axios.post(`http://192.168.13.227:3000/czz/shopping`,{data,num})
      .then((res:any)=>{
        Linking.openURL(res.data.url)
        router.push('/(tabs)/home')
      })
    }
    useEffect(()=>{
        AsyncStorage.getItem('num').then((res)=>{
            setNum(Number(res))
        })
        AsyncStorage.getItem('data').then((res:any)=>{
            setData(JSON.parse(res))
        })

    })
  return (
    <View>
      <View style={{ flexDirection:'row',justifyContent:'space-between',padding:10,backgroundColor:'#fff'}}>
        <View style={{ flexDirection: 'row'}}>        
          <Image source={{ uri: data.img[0] }} style={{ width: 50, height: 75 }} />
          <Text style={{margin:10}}>{data.name}</Text>
        </View>
        <View style={{paddingTop:20}}>
          <Text>￥{data.price}</Text>
          <Text style={{fontSize:12,color:'gray',textAlign:'right'}}>X{num}</Text>
        </View>
      </View>
      <View  style={{ flexDirection: 'row',justifyContent:'space-between',padding:10,backgroundColor:'#fff' }}>
      <Text>商品总价</Text>
        <Text>￥{num*data.price}</Text>
      </View>
        <Button type='primary' style={{width:'90%',margin:'auto'}} onPress={()=>buyItem()}>立即购买</Button>
    </View>
  )
}

const styles = StyleSheet.create({})